
.goods-detail{
  .p-deleted-box{
    height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 999;
    background: #FFFFFF;
  }
  // padding-bottom: calc(210px + env(safe-area-inset-bottom)); //底部安全距离
  padding-bottom: env(safe-area-inset-bottom); //底部安全距离
  // 轮播
  .swiper-contant{
    position: relative;
    .swiper {
      //height: 620px;
      height: 750px;
    }
    .swiper-item {
      display: block;
      //height: 620px;
      height: 750px;
      //line-height: 620px;
      line-height: 750px;
      text-align: center;
    }
    .indicatorDots{
      position: absolute;
      bottom: 30px;
      //right: 25px;
      left: 50%;
      transform: translateX(-50%);
      padding: 0 20px;
      height: 40px;
      line-height: 40px;
      text-align: center;
      color: #fff;
      background: rgba(0, 0, 0, 0.2);
      border-radius: 25px;
      font-size: 28px;
    }
  }
  //  拼团
  .collage{
    background: #FFFFFF;
  }
  // 活动
  .activity{
    width: 100%;
    height: 100px;
    background: $uni-color-primary;
    display: flex;
    ._lf{
      flex: 1;
      display: flex;
      align-items: center;
      padding: 0 24px;
      ._text{
        color: #FFFFFF;
        font-size: 36px;
        font-weight: bold;
      }
    }
    ._rt{
      padding: 14px 38px 14px 0;
    }
  }
  .goods-content{
    background:#ffffff; padding:10px 20px 20px 20px;
    // 价格
    .price{
      padding: 20px 0 0 0;
      display: flex;
      align-items: center;
      ._symbol{
        font-size: 28px;
        color: #EB441F;
      }
      ._up {
        margin-left: 4px;
        font-size: 22px;
        color: #FFFFFF;
      }
      ._red {
        color: #EB441F;
      }
      .low-price{
        font-size: 28px;
        color: #999999;
        margin-left: 20px;
      }
      .coupon-price{
        font-weight: bold;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 50px;
        //line-height: 52px;
        color: #FFFFFF;
        background: $uni-color-primary;
        border-radius: 100px;
        padding: 0 18px;
        text-align: center;
        margin-left: 20px;
        ._coupon-after{
          font-size: 28px;
          margin-right: 6px;
        }
      }
      .sales{
        flex: 1;
        text-align: right;
        color: #646464;
        font-size: 28px;
      }
    }
    // 折扣
    .discount{
      background-color: #fff; display: flex; align-items: center; padding: 20px 0; font-size: $uni-font-size-sm;
      ._title{
        flex: 1; text-align: left; align-items: center; height: 40px; overflow: hidden;
        ._tips{
          display: inline-block;
          color: $uni-color-primary;
          background: rgba(235, 68, 31, 0.16);
          text-align: center;
          padding: 0 12px;
          line-height: 40px;
          border-radius: 4px;
          margin-right: 16px;
          font-size: 30px;
        }
      }
      ._suffix{
        display: flex; align-items: center;
        ._suffix{ padding: 0 5px; font-size: $uni-font-size-mini;}
      }
    }
    .brand{
      display: flex; min-height: 90px;
      .lf{
        flex:1; position: relative; padding-right: 37px;display: flex;flex-direction: column;justify-content: center;
        ._title{
          display: flex; align-items: center;
          position: relative;
          ._tips{
            display: inline-block;
            color: #F5DEBD;
            background: #202020;
            text-align: center;
            padding: 0 8px;
            margin-right: 16px;
            border-radius: 4px;
            height: 44px;
            line-height: 44px;
            font-size: 28px;
            position: absolute;
            top: 8px;
            left: 0;
          }
          ._name{
            flex: 1;
            font-weight: bold;
            font-size: 32px;
            line-height: 44px;
            -webkit-line-clamp: 3;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            overflow: hidden;
            text-overflow: ellipsis;
            margin-top: 8px;
            margin-bottom: 12px;
          }
        }
        ._introduce{
          font-size: 28px;
          color: #999999;
          -webkit-line-clamp: 1;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          overflow: hidden;
          text-overflow: ellipsis;
          word-break: break-all;
        }
        ._vertical-line{
          width: 2px;
          height: 50px;
          background: #EBEDF0;
          position: absolute;
          right: 0;
          //bottom: 16px;
          bottom: 50%;
          transform: translate(0, 50%);
        }
      }
      .rt{
        display: flex;margin-left:30px; align-items: center;
        ._share{
          color: #999999;
          font-size: 22px;
          text-align: center;
        }
      }
    }
    .store{
      display: flex;
      background: $uni-bg-color;
      border-radius: 4px;
      padding: 16px;
      align-items: center;
      margin-top: 24px;
      ._logo{
        width: 50px;
        height: 50px;
        border-right: 2px;
      }
      ._name{
        font-weight: 900;
        font-size: 28px;
        color: #555555;
        margin: 0 16px;
      }
      ._vertical-line{
        width: 2px;
        height: 20px;
        background: #A4A4A4;
      }
      ._introduce{
        flex: 1;
        margin-left: 16px;
        font-weight: 500;
        font-size: 26px;
        color: #646464;
      }
    }
  }

  // 商品介绍/规格信息
  .detail-tab {
    background: #ffffff; margin-top: 16px;
    .sku{
      .ul{
        .li{
          padding: 24px;
          display: flex;
          font-size: 28px;
          border-bottom: 1px solid $uni-page-bg;
          .dd{
            width: 160px;
            color: $uni-color-info;
          }
          .dt{
            flex: 1;
            color: $uni-color-default;
          }
        }
        .li:last-child{
          border-bottom: none;
        }
      }
    }
    image{ width: 100%;}
  }
  // 商品详情
  // 规格信息
  // 看了又看/推荐
  .other-goods{
    ._img{ padding: 24px 170px;}
    .recommend{
      padding: 0 24px;
      ._column{ flex: 1;}
    }
  }
  // 底部固定拼团
  .collage-fixed{
  }
  .swiperitem{
    height: 176px;
  }
  .bottom-no-stock-num{
    width: 100%;
    height: 88px;
    background: #FFF3DA;
    font-size: 28px;
    color: #ED6A0C;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  // 底部固定栏
  .bottom-fixed{
    position: relative;margin-bottom: env(safe-area-inset-bottom);
    ._content{
      display: flex;
      // height: calc(110px + env(safe-area-inset-bottom)); //底部安全距离
      height: 110px; //底部安全距离
      width: 100%;
      background: #ffffff;
      ._lf{
        display: flex;
        align-items: center;
        justify-content: flex-start;
        ._item{
          display: flex;
          align-items: center;
          flex-direction: column;
          width: 114px;
          line-height: 42px;
          margin-top: 16px;
          ._text{
            font-size: 24px;
            color: #646464;
          }
        }
      }
      ._rt{
        display: flex;
        flex: 1;
        background: $uni-color-primary;
        ._one{
          display: flex;
          flex: 1;
          ._buy{ width: 100%; display: flex; align-items: center; justify-content: center;}
        }
        ._two{
          display: flex;
          flex: 1;
          ._buy{ width: 50%; display: flex; align-items: center; justify-content: center;}
          ._orange{
            background: #F8C050;
          }
        }
        ._up{
          font-size: 26px;
          color: #FFFFFF;
        }
        .flex-column{
          display: flex;
          align-items: center;
          text-align: center;
          flex-direction: column;
          color: #ffffff;
          ._price{
            font-size: 36px;
            font-weight: bold;
          }
          ._text{
            font-size: 28px;
          }
        }
      }
    }
  }
  // 分享弹框
  .drawer{
    background: #FFFFFF;
    border-radius: 20px 20px 0px 0px;
    padding-bottom: env(safe-area-inset-bottom);
    ._header{
      text-align: center;
      padding: 36px 40px;
      border-bottom: 1px solid $uni-border-color1;
      ._title{
        font-size: 32px;
        color: #323233;
      }
      .icon{
        float: right;
      }
    }
    ._share{
      display: flex;
      flex-direction: row;
      align-items: center;
      padding: 32px 0;
      ._item{
        width: 33.33%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        ._img{
          width: 96px;
          height: 96px;
          border-radius: 50%;
        }
        ._text{
          color: #323233;
          font-size: 28px;
          margin-top: 16px;
        }
      }
    }
    ._cancel{
      text-align: center;
      padding: 36px 40px;
      border-top: 1px solid $uni-border-color1;
      ._title{
        font-size: 32px;
        color: #323233;
      }
    }
  }
}
.p-poster{
  position: fixed; width: 100%; height: 100%; z-index: 1000; left: 0; top: 0; display: block; overflow: hidden;background-color: rgba(0,0,0,.5);
  .p-container{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 560px;
    .close-icon{
      position: absolute;
      right: -50px;
      top: -50px;
    }
    ._img{
      width: 560px;
      //height: 782px;
      border-radius: 10px;
      overflow: hidden;
      margin: 0 auto;
    }
    .save-poster{
      margin: 0 auto;
      margin-top: 50px;
      width: 280px;
      height: 64px;
      border-radius: 100px;
      background: $uni-color-primary;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
      color: #FFFFFF;
    }
  }
}
#qrcode-wrapper{
  position: absolute;
  width: 750px;
  height: 1048px;
  margin: 0 auto;
  border-radius: 5px;
  overflow: hidden;
  top: -99999899px;
  left: -99999899px;
  z-index: 9999;
}

.m-product-video-back{
  position: fixed; right: 0; top: 40%; width: 110px; height: 111px; border-radius: 10px; background: cdn('/images/product-video-back.png') no-repeat; background-size: cover;
}
